/**
 * 测点规则=> 区域管理
 *
 * **/
import React, {Component} from 'react';
import {connect} from 'dva';
import Container from '../../../../components/Container'
import Filtrate from '../../../../components/Filtrate'
import MyTable from '../../../../components/MyTable'
import config from '../../../../config'
import MyIcon from '../../../../components/MyIcon'
import MyModel from '../../../../components/MyModel'
import tableData from '../tableData'
import PublicService from '../../../../services/PublicService'

class Area extends Component {
  state = {
  };

  componentDidMount(){
    this.props.dispatch({type:'stationRule/getPageListArea'});
    this.props.dispatch({type:'stationRule/getAreaNameDown'});
  }

  onSelectChange(selectedRowKeys,selectedRow) {
    this.props.dispatch({type:'stationRule/saveInfo',payload:{selectedRowsArea:selectedRowKeys}})
  }
  modalCancel(){
    this.props.dispatch({type:'stationRule/saveInfo',payload:{isVisibleArea:false}})
  }
  modalSave(params){
    // 新增编辑
    if(this.props.isAreaItemModal){
      console.log(params);
      params.tagType = params.tagType.key;
      params.factoryId = 1;
      this.props.dispatch({type:'stationRule/submit',payload:{params}})
    }
    //  厂信息
    else{
      params.tagType = params.tagType.key;
      this.props.dispatch(({type:'stationRule/submitFactor',payload:{params}}))
    }

  }
  addHandle(){
    this.props.dispatch({type:'stationRule/saveInfo',payload:{isVisibleArea:true,isAreaItemModal:true,isEdit:false}})
  }

  deleteHandle(){
    this.props.dispatch({type:'stationRule/deleteHandle'})
  }

  // 厂信息点击按钮
  factorClick(){
    this.props.dispatch({type:'stationRule/readFactorHandle',payload:{isVisibleArea:true,isAreaItemModal:false}})
  }

  onChangePage(page,size){
    this.props.dispatch({type:'stationRule/pageChangeHandle',payload:{page,size}})
  }

  edit(record){
    console.log(record);
    this.props.dispatch({type:'stationRule/editReadHandle',payload:{areaId:record.id,isEdit:true,isVisibleArea:true}})
  }
  read(record){
    console.log(record);
    this.props.dispatch({type:'stationRule/editReadHandle',payload:{areaId:record.id,isEdit:false,isVisibleArea:true}})
  }
  search(data){
    this.props.dispatch({type:'stationRule/search',payload:data})
  }
  render() {
    let {selectedRowKeys} = this.props;
    let rowSelection = {
      selectedRowKeys,
      onChange: this.onSelectChange.bind(this),
    };
    let height = document.body.clientHeight;
    return (
      <div>
        <Filtrate
          submit={this.search.bind(this)}
          items={tableData.itemsArea(this.props.areaNameDown)}/>
        <Container
          addBtnShow
          addBtn={this.addHandle.bind(this)}
          deleteBtnShow
          deleteBtn={this.deleteHandle.bind(this)}
          extraBtn={tableData.extraBtnArea}
          factorClick={this.factorClick.bind(this)}
        >
          <MyTable
            columns={tableData.columnsArea(this.edit.bind(this),this.read.bind(this))}
            dataSource={PublicService.transformArrayData(this.props.dataSource,true,false,this.props.page,this.props.size)}
            scroll={{y: height - 317}}
            rowKey="id"
            loading={this.props.loading}
            rowSelection={rowSelection}
            pagination={{
              size: config.size,
              pageSize:this.props.size,
              total:this.props.total,
              current:this.props.page,
              showQuickJumper: true,
              onChange:this.onChangePage.bind(this)
            }}
          />
        </Container>
        {
          this.props.visible && <MyModel
            title={this.props.isEdit ? '查看' :this.props.initData.id ? '编辑': '新增'}
            visible={this.props.visible}
            width={590}
            okText="保存"
            onCancel={this.modalCancel.bind(this)}
            onSave={this.modalSave.bind(this)}
            items={this.props.isAreaItemModal ? tableData.itemsModalArea(this.props.initDataArea):tableData.itemsModalFactor(this.props.initDataFactor)}
            editAble={this.props.isEdit}
            formItemLayout={{
              labelCol: {span: 24},
              wrapperCol: {span: 24}
            }}
          />
        }
      </div>
    )
  }
}

function mapStateToProps(state) {
  return {
    visible:state.stationRule.isVisibleArea,
    isAreaItemModal:state.stationRule.isAreaItemModal,
    selectedRowKeys:state.stationRule.selectedRowsArea,
    size:state.stationRule.size,
    page:state.stationRule.page,
    total:state.stationRule.total,
    dataSource:state.stationRule.dataSourceArea,
    initDataArea:state.stationRule.initDataArea,
    initDataFactor:state.stationRule.initDataFactor,
    loading:state.stationRule.loading,
    isEdit:state.stationRule.isEdit,
    areaNameDown:state.stationRule.areaNameDown,

  }
}

export default connect(mapStateToProps)(Area)


